<!DOCTYPE html>
<html lang="zh-Hans-CN">
<head>
	<meta charset="UTF-8">
	<title>端午送礼 迎接裤爽夏日</title>
	<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"/>
	<meta name="format-detection" content="telephone=no">
	<meta name="format-detection" content="email=no">
	<link rel="stylesheet" href="css/style.css"/>
</head>
<body>
  <!--<div class="loading-box">-->
    <!--<div class="logo-an"></div>-->
  <!--</div>-->
	<header>
		<img class="banner" src="img/banner.jpg" alt="banner"/>
	</header>
	<section class="container">
		<article class="status">
			<img src="img/tit.png" alt="tit"/>
		</article>

		<article class="content">
			<div class="input-group">
				<label for="stores" class="input-label">选择店面：</label>
				<input type="text" class="input-control" placeholder="选择店面" onfocus="this.blur()" readonly id="stores"/>
			</div>

			<div class="input-group">
				<label for="datetime" class="input-label">购物时间：</label>
				<input type="text" class="input-control" placeholder="选择购物时间" onfocus="this.blur()" readonly id="datetime" />
			</div>

			<div class="input-group">
				<label for="num" class="input-label">产品数量：</label>
				<select name="" id="num" class="input-control">
					<option value="">请选择</option>
					<option value="1">1</option>
					<option value="2">2</option>
					<option value="3">3</option>
					<option value="4">4</option>
					<option value="5">5</option>
					<option value="6">6</option>
					<option value="7">7</option>
					<option value="8">8</option>
					<option value="9">9</option>
					<option value="10">10个以上</option>
				</select>
			</div>

      <div class="input-group no-m">
        <span for="datetime" class="input-label">小票上传：</span>
        <span class="form-span">
					<label class="radiobox action" data-val="0"><i class="radio"></i>整张小票</label>
					<label class="radiobox" data-val="1"><i class="radio"></i>分段小票</label>
					<input class="radio-val" type="hidden" value="0" id="sec"/>
				</span>
      </div>

			<div class="btn-group">
				<span class="min-load" id="load-info"><span class="pull-left red">&nbsp;*请保证小票清晰可见，长小票请选择分段上传</span></span>
				<button class="btn-default" type="button" id="upimg">上传购物小票</button>
				<button class="btn-default btn-min" type="button" id="goon" hidden>立即提交</button>
			</div>
		</article>

		<article class="info">
			<h2 class="info-title">活动规则</h2>
			<div class="info-content">
        <p><strong>活动时间：</strong>2016年6月9日-2016年6月30日</p>
        <p><strong>活动地点：</strong>指定6大母婴店，爱婴室（仅限浙沪区域），乐友，婴知岛（仅限苏州），贝贝熊，孩子王，爱婴岛（仅限广东区域）参加活动</p>
        <p><strong>参与方式：</strong> <br>指定母婴店购买帮宝适敏感肌和特级棉柔拉拉裤系列，即可微信扫二维码进入活动页面。</p>
        <p><strong>兑奖方式：</strong> <br>上传购物小票，24小时内审核通过后，获得10元现金微信红包。</p>
        <p><strong>活动说明：</strong> <br>1，本次活动限全国指定门店参加，微信红包份数21000份，先到先得，送完即止；<br>
          2，1个微信ID，1张购物小票只能参加1次活动；<br>
          3，每1包指定产品，可获得1个10元微信红包；<br>
          4，1张购物小票，最多奖励不超过100元微信红包；<br>
          5，宝洁公司有权依法进行解释未尽事宜。</p>
        <p><strong>活动热线：</strong>400-6666-225</p>
			</div>
		</article>
	</section>


	<!-- 选择卖场 -->
	<div class="stores">
		<div class="stores-mask"></div>
		<div class="stores-content">
			<h2 class="st-tit text-center">选择卖场</h2>
			<div class="search-box">
				<div class="table-cell ver-m"><input class="sea-input" type="text" value="" placeholder="搜索卖场"/></div>
				<button class="sea-btn" type="button" id="search" >搜索</button>
			</div>
			<ul class="st-ul">
				<li class="layer"><img class="st-img" src="img/data/walmart.png" alt="supper"/><span class="st-val">沃尔玛超市</span></li>
				<li class="layer"><img class="st-img" src="img/data/r1.jpg" alt="supper"/><span class="st-val">奥斯卡京东方</span></li>
				<li class="layer"><img class="st-img" src="img/data/r2.jpg" alt="supper"/><span class="st-val">阿斯顿发撒的</span></li>
				<li class="layer"><img class="st-img" src="img/data/r3.jpg" alt="supper"/><span class="st-val">沃尔玛超市</span></li>
				<li class="layer"><img class="st-img" src="img/data/r4.jpg" alt="supper"/><span class="st-val">阿斯顿飞师傅</span></li>
				<li class="layer"><img class="st-img" src="img/data/11.世纪联华.jpg" alt="supper"/><span class="st-val">阿斯顿飞爱上安防啊</span></li>
				<li class="layer"><img class="st-img" src="img/data/17.利群福兴祥超市.jpg" alt="supper"/><span class="st-val">沃尔玛超市</span></li>
				<li class="layer"><img class="st-img" src="img/data/21.百佳超市.jpg" alt="supper"/><span class="st-val">asdfasdfs</span></li>
				<li class="layer"><img class="st-img" src="img/data/walmart.png" alt="supper"/><span class="st-val">132132</span></li>
				<li class="layer"><img class="st-img" src="img/data/walmart.png" alt="supper"/><span class="st-val">沃尔玛超市</span></li>

				<!-- 加载更多 start -->
				<div class="moremarket-list"></div>
				<li class="text-center">
					<a class="btn" id="moremarket" href="javascript:;">加载更多卖场</a>
				</li>
				<!-- 加载更多 end -->

			</ul>
		</div>
	</div>

	<script src="lib/zepto.min.js"></script>
	<script src="lib/zepto.mdater.js"></script>
	<script src="js/main.js"></script>
	<script>
	(function() {
    /**
     * 设置选择时间插件
     */
    $('#datetime').mdater({
      minDate: new Date(2015, 6, 13)
    });
    /**
     * 选择卖场
     */
    stores.init();
    /**
     * 表单验证
     */
    form.init('../data/data.json');
    /**
     * iphone4 样式
     */
    mediaIp4(function () {
      $('.banner').attr('src','img/banner2.jpg');
      $('.container').addClass('ip4-con');
    });
    /**
     * 默认加载
     */
//    $(window).on('load',function () {
//      $('.loading-box').remove();
//    });
  })();
	</script>
</body>
</html>
